import React from 'react'
import Menu from '@/views/common/menu'
import styles from '@/assets/css/user.module.css';

export default () =>
{
    const Email = () => 
    {
        if(React.business.auth == '0')
        {
            return (
                <div className={styles.item}>
                    <NavLink to="/business/email" >
                        <div className={styles.title}>邮箱认证</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
            )
        }else
        {
            return (<></>)
        }
    }

    // 退出登录
    const Logout = () =>
    {
        React.UI.Dialog.confirm({
            title: '退出提醒',
            content: '是否确认退出登录',
            onConfirm: () =>
            {
                //删除cookie
                React.cookies.remove('business', {path: '/'})
                React.business = {}

                //跳转回登录界面
                React.navigate('/business/login')
                return false
            }
        }).catch(() => {})
    }

    return (
        <>
            <div className={styles.header}>
                <div className={styles.userinfo}>
                    <div className={styles.avatar}>
                        <img src={React.business.avatar_text} alt="" />
                    </div>
                    <div className={styles.nickname}>{React.business.nickname}</div>
                </div>
                <div className={styles.corrugated}>
                    <div className={`${styles.wave_top} ${styles.wave_item}`}></div>
                    <div className={`${styles.wave_middle} ${styles.wave_item}`}></div>
                </div>
            </div>

            <div className={styles.menu_cell}>
                <div className={styles.item}>
                    <NavLink to="/business/profile" >
                        <div className={styles.title}>个人资料</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>

                <Email />

                <div className={styles.item}>
                    <NavLink to="/guest" >
                        <div className={styles.title}>住客信息</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item}>
                    <NavLink to="/order" >
                        <div className={styles.title}>房间订单</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item}>
                    <NavLink to="/business/coupon" >
                        <div className={styles.title}>我的优惠券</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item}>
                    <NavLink to="/business/about" >
                        <div className={styles.title}>关于我们</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item} onClick={Logout}>
                    <a>
                        <div className={styles.title}>退出登陆</div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </a>
                </div>
            </div>

            <div className={styles.footer}>
                <Menu />
            </div>
        </>
    )
}